<!--  -->
<template>
      <div class="col-md-10">
    <form action="" method="post" role="form" @submit.prevent="edit()">
      <legend>修改英雄</legend>
      <div class="form-group">
        <label>英雄名称</label>
        <input  v-model="heroName" type="text" class="form-control">
      </div>
      <div class="form-group">
        <label>英雄性别</label>
        <input v-model="gender" type="text" class="form-control">
      </div>
      <button type="submit" class="btn btn-primary">修改</button>
    </form>
  </div>
</template>

<script>
// import  axios from 'axios'
export default {
  data () {
    return {
      heroName:'',
      gender:'',
      id:''
    }
  },
  created() {
      this.gethero();
  },
    methods:{
        gethero(){
     this.$axios({
       method:'get',
        url:`heroes/${this.$route.params.id}`
    }).then(res=>{
        this.heroName = res.data.heroName
        this.gender = res.data.gender
        this.id = res.data.id
    })
        },
        edit(){
          const data = {
            id:this.id,
            heroName:this.heroName,
            gender:this.gender,
            time:new Date()
          }
          this.$axios({
            method:'put',
            url:`heroes/${this.id}`,
           data:data
          }).then(()=>{
            this.$router.push('/hero')
          }).cacth(()=>{
            alert('修改失败！！')
          })
        }
    }
}

</script>

<style lang='stylus' scoped>

</style>
